<template>
  <view class="page">
    <view class="top-box">
        <u-icon name="checkmark-circle-fill" color="#FFBB50" size="48"></u-icon>
        充值成功
        <view class="price">￥10</view>
    </view>
    <view class="box">
        <view class="box-item flex">
            旺币余额
            <view class="box-item-1">100</view>
        </view>
        <view class="box-item flex">
            支付方式
            <view class="box-item-1">微信支付</view>
        </view>
        <view class="box-item flex">
            支付时间
            <view class="box-item-1">2024/10/29 08:52</view>
        </view>
        <view class="box-item flex" style="border: none;">
            订单号
            <view class="box-item-1">W2024102908522977327505</view>
        </view>
    </view>
    <view class="btn" @click="handleSuccess">完成</view>
  </view>
</template>
<script>
export default {
  data() {
    return {};
  },
  methods:{
    handleSuccess(){
        uni.navigateBack({ delta: 1 })
    },
  }
};
</script>
<style lang="scss" scoped>
.page {
  background-color: #ffffff;
  .btn{
    margin-top: 60rpx;
  }
  .box{
    width: 694rpx;
    margin: 120rpx auto 0;
    .box-item{
        padding: 26rpx 0;
        border-bottom: 1rpx solid#f2f2f2;
        justify-content: space-between;
    }
  }
  .top-box{
    width: 200rpx;
    margin: 60rpx auto 0;
    text-align: center;
    ::v-deep .u-icon{
        margin: 0 auto;
        flex-direction:column;
    }
    .price{
        font-size: 38rpx;
        margin-top: 28rpx;
    }
  }
}
</style>